<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

<head>
    <!-- 页面meta -->
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>个人中心</title>
    <meta name="description">
    <meta name="keywords">

    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
    <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
    <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <link rel="stylesheet" th:href="@{/plugins/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/plugins/font-awesome/css/font-awesome.min.css}">
    <link rel="stylesheet" th:href="@{/plugins/ionicons/css/ionicons.min.css}">
    <link rel="stylesheet" th:href="@{/plugins/iCheck/square/blue.css}">
    <link rel="stylesheet" th:href="@{/plugins/morris/morris.css}">
    <link rel="stylesheet" th:href="@{/plugins/jvectormap/jquery-jvectormap-1.2.2.css}">
    <link rel="stylesheet" th:href="@{/plugins/datepicker/datepicker3.css}">
    <link rel="stylesheet" th:href="@{/plugins/daterangepicker/daterangepicker.css}">
    <link rel="stylesheet" th:href="@{/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.min.css}">
    <link rel="stylesheet" th:href="@{/plugins/datatables/dataTables.bootstrap.css}">
    <link rel="stylesheet" th:href="@{/plugins/treeTable/jquery.treetable.css}">
    <link rel="stylesheet" th:href="@{/plugins/treeTable/jquery.treetable.theme.default.css}">
    <link rel="stylesheet" th:href="@{/plugins/select2/select2.css}">
    <link rel="stylesheet" th:href="@{/plugins/colorpicker/bootstrap-colorpicker.min.css}">
    <link rel="stylesheet" th:href="@{/plugins/bootstrap-markdown/css/bootstrap-markdown.min.css}">
    <link rel="stylesheet" th:href="@{/plugins/adminLTE/css/AdminLTE.css}">
    <link rel="stylesheet" th:href="@{/plugins/adminLTE/css/skins/_all-skins.min.css}">
    <link rel="stylesheet" th:href="@{/css/style.css}">
    <link rel="stylesheet" th:href="@{/plugins/ionslider/ion.rangeSlider.css}">
    <link rel="stylesheet" th:href="@{/plugins/ionslider/ion.rangeSlider.skinNice.css}">
    <link rel="stylesheet" th:href="@{/plugins/bootstrap-slider/slider.css}">
    <link rel="stylesheet" th:href="@{/plugins/bootstrap-datetimepicker/bootstrap-datetimepicker.css}">
</head>

<body class="hold-transition skin-purple sidebar-mini">

    <div class="wrapper">

        <!-- 页面头部 -->
        <div th:include="~{/common/common::headerid}"></div>
        <!-- 页面头部 /-->

        <!-- 导航侧栏 -->
        <div th:include="~{/common/common::sidebarId}"></div>
        <!-- 导航侧栏 /-->

        <!-- 内容区域 -->
        <!-- Content Wrapper. Contains page content -->
        <div class="content-wrapper">
            <!-- Content Header (Page header) -->
            <section class="content-header">
                <h1>
                    个人中心
                </h1>
                <ol class="breadcrumb">
                    <li><a th:href="@{/main.html}"><i class="fa fa-dashboard"></i> 首页</a></li>
                    <li><a th:href="@{/Y_travel/profile/findProfile}">个人中心</a></li>
                    <li class="active">全部信息</li>
                </ol>
            </section>

            <!-- Main content -->
            <section class="content">

                <div class="row">
                    <div class="col-md-3">

                        <!-- Profile Image -->
                        <!--用户介绍-->
                        <div class="box box-primary">
                            <div class="box-body box-profile">
                                <img class="profile-user-img img-responsive img-circle" th:src="@{/img/user2-160x160.jpg}" alt="User profile picture">

                                <h3 class="profile-username text-center">[[${session.SPRING_SECURITY_CONTEXT.authentication.principal.username}]]</h3>

                                <p class="text-muted text-center" th:text="${role}"></p>
                                <ul class="list-group list-group-unbordered">
                                    <li class="list-group-item">
                                        <b>介绍：</b>
                                    </li>
                                    <li class="list-group-item">
                                         <b th:text="${role}=='[ROLE_USER]'? '普通管理员':'超级管理员'"></b>
                                    </li>
                                </ul>
                            </div>
                            <!-- /.box-body -->
                        </div>
                        <!-- /.box -->

                        <!-- About Me Box -->
                        <!-- /.box -->
                    </div>
                    <!-- /.col -->
                    <div class="col-md-9">
                        <div class="nav-tabs-custom">
                            <ul class="nav nav-tabs">
                                <li class="active"><a href="#timeline" data-toggle="tab">待办</a></li>
                                <li><a href="#settings" data-toggle="tab">修改个人信息</a></li>
                            </ul>
                            <div class="tab-content">
                                <!-- /.tab-pane -->
                                <div class="active tab-pane" id="timeline">
                                    <!-- The timeline -->
                                    <ul class="timeline timeline-inverse">
                                        <!-- timeline time label -->
                                        <li class="time-label">
                                            <span class="bg-red" th:text="${#dates.format(new java.util.Date().getTime(), 'yyyy-MM-dd')}">

                        </span>
                                        </li>
                                        <!-- /.timeline-label -->
                                        <!-- timeline item -->
                                        <li>
                                            <i class="fa fa-envelope bg-blue"></i>

                                            <div class="timeline-item">
                                                <span class="time"><i class="fa fa-clock-o"></i> 15 分钟前</span>

                                                <h3 class="timeline-header"><a href="#">Support Team</a> 给您发送了一封邮件</h3>

                                                <div class="timeline-body">
                                                    邮件内容...
                                                </div>
                                                <div class="timeline-footer">
                                                    <a class="btn btn-primary btn-xs">已读</a>
                                                    <a class="btn btn-danger btn-xs">删除</a>
                                                </div>
                                            </div>
                                        </li>
                                        <!-- END timeline item -->
                                        <!-- timeline item -->
                                        <li>
                                            <i class="fa fa-user bg-aqua"></i>

                                            <div class="timeline-item">
                                                <span class="time"><i class="fa fa-clock-o"></i> 下午 2:00</span>

                                                <h3 class="timeline-header no-border"><a href="#">团队会议</a> 讨论项目
                                                </h3>
                                            </div>
                                        </li>
                                        <!-- END timeline item -->
                                        <!-- timeline item -->
                                        <li>
                                            <i class="fa fa-comments bg-yellow"></i>

                                            <div class="timeline-item">
                                                <span class="time"><i class="fa fa-clock-o"></i>  27 分钟前</span>

                                                <h3 class="timeline-header"><a href="#">Jay White</a> 回复了您的信息</h3>

                                                <div class="timeline-body">
                                                   信息！
                                                </div>
                                                <div class="timeline-footer">
                                                    <a class="btn btn-warning btn-flat btn-xs">回复</a>
                                                </div>
                                            </div>
                                        </li>
                                        <!-- END timeline item -->
                                        <!-- timeline time label -->
                                </div>
                                <!-- /.tab-pane -->

                                <div class="tab-pane" id="settings">
                                    <form class="form-horizontal" th:action="@{/Y_travel/profile/changeProfile}" method="post">
                                        <div class="form-group">
                                            <label for="inputEmail" class="col-sm-2 control-label">邮箱</label>

                                            <div class="col-sm-10">
                                                <input type="email" class="form-control" id="inputEmail" name="email" th:placeholder="${email}" value="">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label for="inputExperience" class="col-sm-2 control-label">联系方式</label>

                                            <div class="col-sm-10">
                                                <input class="form-control" id="inputExperience" name="phoneNum" th:placeholder="${phone}" value=""></input>
                                            </div>
                                        </div>
                                        <!--<div class="form-group">-->
                                            <!--<label for="inputSkills" class="col-sm-2 control-label">角色</label>-->

                                            <!--<div class="col-sm-10">-->
                                                <!--<input type="text" class="form-control" id="inputSkills" th:placeholder="${roles}" name="roleName" value="">-->
                                            <!--</div>-->
                                        <!--</div>-->
                                        <div class="form-group">
                                            <label for="inputName" class="col-sm-2 control-label">用户状态</label>
                                            <div class="col-md-4 data">
                                                <select class="form-control select2" style="width: 100%"
                                                        name="status">
                                                    <option value="0" selected="selected">关闭</option>
                                                    <option value="1">开启</option>
                                                </select>
                                            </div>
                                        </div>

                                        <div class="form-group">
                                            <div class="col-sm-offset-2 col-sm-10">
                                                <div class="checkbox">
                                                    <label>
                          <input type="checkbox"> 我已同意修改
                        </label>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="col-sm-offset-2 col-sm-10">
                                                <button type="submit" onclick="return confirm('是否确定修改个人信息？')" class="btn btn-danger">确认修改</button>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                                <!-- /.tab-pane -->
                            </div>
                            <!-- /.tab-content -->
                        </div>
                        <!-- /.nav-tabs-custom -->
                    </div>
                    <!-- /.col -->
                </div>
                <!-- /.row -->

            </section>
            <!-- /.content -->
        </div>
        <!-- /.content-wrapper -->
        <!-- 内容区域 /-->

        <!-- 底部导航 -->
        <div th:include="~{/common/common::footerId}"></div>
        <!-- 底部导航 /-->

    </div>


    <script th:src="@{/plugins/jQuery/jquery-2.2.3.min.js}"></script>
    <script th:src="@{/plugins/jQueryUI/jquery-ui.min.js}"></script>
    <script>
        $.widget.bridge('uibutton', $.ui.button);
    </script>
    <script th:src="@{/plugins/bootstrap/js/bootstrap.min.js}"></script>
    <script th:src="@{/plugins/raphael/raphael-min.js}"></script>
    <script th:src="@{/plugins/morris/morris.min.js}"></script>
    <script th:src="@{/plugins/sparkline/jquery.sparkline.min.js}"></script>
    <script th:src="@{/plugins/jvectormap/jquery-jvectormap-1.2.2.min.js}"></script>
    <script th:src="@{/plugins/jvectormap/jquery-jvectormap-world-mill-en.js}"></script>
    <script th:src="@{/plugins/knob/jquery.knob.js}"></script>
    <script th:src="@{/plugins/daterangepicker/moment.min.js}"></script>
    <script th:src="@{/plugins/daterangepicker/daterangepicker.js}"></script>
    <script th:src="@{/plugins/daterangepicker/daterangepicker.zh-CN.js}"></script>
    <script th:src="@{/plugins/datepicker/bootstrap-datepicker.js}"></script>
    <script th:src="@{/plugins/datepicker/locales/bootstrap-datepicker.zh-CN.js}"></script>
    <script th:src="@{/plugins/bootstrap-wysihtml5/bootstrap3-wysihtml5.all.min.js}"></script>
    <script th:src="@{/plugins/slimScroll/jquery.slimscroll.min.js}"></script>
    <script th:src="@{/plugins/fastclick/fastclick.js}"></script>
    <script th:src="@{/plugins/iCheck/icheck.min.js}"></script>
    <script th:src="@{/plugins/adminLTE/js/app.min.js}"></script>
    <script th:src="@{/plugins/treeTable/jquery.treetable.js}"></script>
    <script th:src="@{/plugins/select2/select2.full.min.js}"></script>
    <script th:src="@{/plugins/colorpicker/bootstrap-colorpicker.min.js}"></script>
    <script th:src="@{/plugins/bootstrap-wysihtml5/bootstrap-wysihtml5.zh-CN.js}"></script>
    <script th:src="@{/plugins/bootstrap-markdown/js/bootstrap-markdown.js}"></script>
    <script th:src="@{/plugins/bootstrap-markdown/locale/bootstrap-markdown.zh.js}"></script>
    <script th:src="@{/plugins/bootstrap-markdown/js/markdown.js}"></script>
    <script th:src="@{/plugins/bootstrap-markdown/js/to-markdown.js}"></script>
    <script th:src="@{/plugins/ckeditor/ckeditor.js}"></script>
    <script th:src="@{/plugins/input-mask/jquery.inputmask.js}"></script>
    <script th:src="@{/plugins/input-mask/jquery.inputmask.date.extensions.js}"></script>
    <script th:src="@{/plugins/input-mask/jquery.inputmask.extensions.js}"></script>
    <script th:src="@{/plugins/datatables/jquery.dataTables.min.js}"></script>
    <script th:src="@{/plugins/datatables/dataTables.bootstrap.min.js}"></script>
    <script th:src="@{/plugins/chartjs/Chart.min.js}"></script>
    <script th:src="@{/plugins/flot/jquery.flot.min.js}"></script>
    <script th:src="@{/plugins/flot/jquery.flot.resize.min.js}"></script>
    <script th:src="@{/plugins/flot/jquery.flot.pie.min.js}"></script>
    <script th:src="@{/plugins/flot/jquery.flot.categories.min.js}"></script>
    <script th:src="@{/plugins/ionslider/ion.rangeSlider.min.js}"></script>
    <script th:src="@{/plugins/bootstrap-slider/bootstrap-slider.js}"></script>
    <script th:src="@{/plugins/bootstrap-datetimepicker/bootstrap-datetimepicker.js}"></script>
    <script th:src="@{/plugins/bootstrap-datetimepicker/locales/bootstrap-datetimepicker.zh-CN.js}"></script>
    <script>
        $(document).ready(function() {
            // 选择框
            $(".select2").select2();

            // WYSIHTML5编辑器
            $(".textarea").wysihtml5({
                locale: 'zh-CN'
            });
        });


        // 设置激活菜单
        function setSidebarActive(tagUri) {
            var liObj = $("#" + tagUri);
            if (liObj.length > 0) {
                liObj.parent().parent().addClass("active");
                liObj.addClass("active");
            }
        }


        $(document).ready(function() {
            // 激活导航位置
            setSidebarActive("admin-index");
        });
    </script>
</body>

</html>
<!---->